<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery带文字缩略图的图片轮播代码演示_大头网</title>

<link type="text/css" rel="stylesheet" href="css/style.css">

<script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="js/slides-1.1.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {

	

  $("#wxt").append("<li> <div><img src='images/s1.jpg' url='url' bigImg='images/1.jpg' ></div></li>");
   $("#wxt").append("<li> <div><img src='images/s2.jpg' url='url' bigImg='images/2.jpg' ></div></li>");
    $("#wxt").append("<li> <div><img src='images/s3.jpg' url='url' bigImg='images/3.jpg' ></div></li>");
	 $("#wxt").append("<li> <div><img src='images/s4.jpg' url='url' bigImg='images/4.jpg' ></div></li>");
	  $("#wxt").append("<li> <div><img src='images/s5.jpg' url='url' bigImg='images/5.jpg' ></div></li>");

	  
  // $("#pre").append("<li> <div><img src='images/s1.jpg' url='url' bigImg='images/1.jpg' ></div></li>");
  //  $("#pre").append("<li> <div><img src='images/s2.jpg' url='url' bigImg='images/2.jpg' ></div></li>");
  //   $("#pre").append("<li> <div><img src='images/s3.jpg' url='url' bigImg='images/3.jpg' ></div></li>");
	 // $("#pre").append("<li> <div><img src='images/s4.jpg' url='url' bigImg='images/4.jpg' ></div></li>");


	 	$('.succesny').olvSlides({
		thumb: true,
		thumbPage: true,
		thumbDirection: "Y",
		effect: 'fade'

	});

	// $('.succesny1').olvSlides({
	// 	thumb: true,
	// 	thumbPage: true,
	// 	thumbDirection: "Y",
	// 	effect: 'fade'

	// });

})


</script>

</head>
<body>
<br>
<!-- 代码 开始 -->
<div class="successlunbo">
	<div class="succesny">
		<div class="control">
			<ul class="change">
			</ul>
		</div>
		<div class="thumbWrap">
			<div class="thumbCont" >
				<ul id="wxt"> 
				
				</ul>
			</div>
		</div>
	</div>

	<div class="succesny1" style="margin-top:20px;">
		<div class="control">
			<ul class="change">
			</ul>
		</div>
		<div class="thumbWrap">
			<div class="thumbCont" id="pre">
				<ul id="pre">
			
				
				</ul>
			</div>
		</div>
	</div>
</div>
<!-- 代码 结束 -->



</body>
</html>

